<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8" />
		<meta http-equiv="X-UA-Compatible" content="IE=edge" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
		<title>首页</title>
		<!-- 重置 -->
		<link rel="stylesheet" href="../css/reset.css" />
		<!-- 常态化 -->
		<link rel="stylesheet" href="../css/normalize.css" />
		<link rel="stylesheet" href="../css/common.css" />
		<link rel="stylesheet" href="../css/top&footer.css" />
		<link rel="stylesheet" href="../css/model.css" />
		<!-- 图标字体 -->
		<link rel="stylesheet" href="../图标字体/1/iconfont.css" />
		<!-- 4.引入swiper样式-->
		<link rel="stylesheet" href="../lib/swiper-bundle.min.css" />
		<link rel="stylesheet" href="../css/index.css" />
	</head>

	<body>
		<!-- 头部 -->
		<header class="z99">
			<div class="header-top fe b-box flex-c-sb">
				<!-- log -->
				<img src="../img/new-logo-white.png" alt="" />
				<!-- nav -->
				<nav class="nav-top fe flex-sb">
					<a href="../html/index.html" class="fc-white active">首页</a>
					<a href="../html/api.html" class="fc-white">API</a>
					<a href="../html/service.html" class="fc-white">云服务</a>
					<a href="../html/example.html" class="fc-white">案例</a>
					<a href="../html/developer.html" class="fc-white">开发者</a>
				</nav>
				<!-- 登录注册 -->
				<div class="btn-top fe flex-sb">
					<button class="log-top fc-white cursor">登录</button>
					<button class="register-top cursor">注册有礼</button>
				</div>
			</div>
		</header>
		<!-- 主体 -->
		<main>
			<span class="reminder111">可跳转的有</span>
			<span class="reminder222">头部：登录、注册有礼、验证码</span>
			<span class="reminder333">主体：蓝、白字</span>
			<span class="reminder444">慧集区可留一会</span>
			<!-- 第一部分 banner图 -->
			<section id="banner">
				<div class="swiper">
					<div class="swiper-wrapper">
						<div class="swiper-slide"></div>
						<div class="swiper-slide"></div>
						<div class="swiper-slide"></div>
					</div>
					<!--分页器。如果放置在swiper外面，需要自定义样式。-->
					<div class="swiper-pagination"></div>
				</div>
				<!-- 箭头 -->
				<div id="arrows">
					<span class="iconfont1 icon-fangxiang-xiangzuo"> </span>

					<span class="iconfont1 icon-fangxiang-xiangyou"></span>
				</div>
			</section>

			<!-- 第二部分 服务 -->
			<section id="index-one" class="fe">
				<!-- 上方文字部分 -->
				<div id="t1">
					<h1>为开发者提供云服务</h1>
					<p>
						基于API技术向客户提供多领域、多场景的Sass服务；助力开发者提高生产效率，加快工作进程
					</p>
					<!-- 链接 -->
					<a href="../html/service.html">探索云服务&emsp;></a>
				</div>
				<!-- 下方板块 -->
				<div id="something" class="fe"></div>
			</section>
			<!-- 第三部分 api-->
			<section id="index-two">
				<div id="two-bg" class="fe">
					<!-- 文字描述 -->
					<div id="t1">
						<h1>海量的API服务，丰富的API分类</h1>
						<p>
							提供400多种API和数据块，快捷、易用、稳定，极大的满足了用户数据需求；节省了寻找时间，节约了数据维护的服务器和人力成本。
						</p>
						<!-- 链接 -->
						<a href="../html/api.html">探索API&emsp;></a>
					</div>
					<!-- 具体板块 -->
					<div id="t2" class="fe"></div>
					<!-- 链接 -->
					<p>
						另外，更多免费API任您挑选，
						<a href="../html/login.html" class="fc-blue">马上申请></a>
					</p>
				</div>
			</section>

			<!-- 第四部分 惠集-->
			<section id="index-three">
				<div id="index3-1" class="fe">
					<!-- 文字描述 -->
					<div id="t1">
						<h1>慧集 / APIMaster</h1>
						<p>
							API集成中台包括：API设计、API开发、API测试、API发布、API网关、API市场等功能，支持API的鉴权、流控、熔断等，涵盖了API的全生命周期。
						</p>
						<a href="#">探索慧集&emsp;></a>
					</div>
					<!-- 具体板块 -->

					<div id="index3-1-2" class="fe">
						<!-- 左侧 -->
						<img src="../img/master-left-bg.svg" alt="" />
						<!-- 右侧 -->
						<div id="index3-event">
							<div>
								<h3>
									<img src="../img/master-item-icon-01.svg" alt="" />
									API开放共享
								</h3>
								<p>
									将核心能力以API形式对外输出，赋能到多领域、多场景的应用程序中
								</p>
								<p class="rectangle"></p>
							</div>
						</div>
					</div>
				</div>
			</section>

			<!-- 第五部分 行业巨头 -->
			<section id="index-four" class="fe">
				<!-- 文字描述 -->
				<div id="f1">
					<h1>助力行业巨头 / 独角兽企业</h1>
					<p>
						<a href="../html/example.html" class="fc-blue"
							>看看我们服务了谁&emsp;></a
						>
					</p>
				</div>
				<!-- 具体板块 -->
				<div id="f2" class="bg-gray">
					<div id="icon"></div>
				</div>
			</section>
			<!-- 第六部分 各企业图标 -->
			<section id="index-five">
				<div class="fe">
					<div class="fe company"></div>
					<!-- 安全与服务 -->
					<div>
						<h1>数据安全和可靠合规的服务</h1>
						<p>保证每一个客户放心使用</p>
						<p>
							<a href="../html/login.html" class="fc-blue">立即使用&emsp;</a>
						</p>
					</div>
					<!-- 证书 -->
					<div class="fe certificate"></div>
				</div>
			</section>
			<!-- 第七部分 -->
			<section id="index-six">
				<div>
					<h1>免费试用上百种API、体验各类产品和服务</h1>
					<p class="rel">
						<a class="fc-white" href="../html/login.html">立即体验</a>
					</p>
				</div>
			</section>
		</main>

		<!-- 尾部 -->
		<footer class="b-box">
			<div class="fe flex-c-sb">
				<!-- 左 -->
				<div id="foot-left" class="fe">
					<ul class="fe flex-sb"></ul>
				</div>
				<!-- 右 -->
				<div id="foot-right">
					<div>
						<h1>微信公众号</h1>
						<p>源码时代</p>
					</div>
					<p class="fc-gray"><img src="../img/103-demo.png" alt="" /></p>
				</div>
			</div>
			<!-- 最后 -->
			<div class="fe" id="last">
				<div id="licence" class="fe flex-b-sb">
					<img src="../img/bei1.png" alt="" />
					<img src="../img/bei2.png" alt="" />
					<p>
						增值电信业务经营许可证：蜀B2-20180596蜀ICP备15006450号-3营业执照
					</p>
				</div>

				<p class="fc-gray">源码大数据股份有限公司©版权所有</p>
			</div>
			<span class="iconfont6 icon-fangxiangyuan-xiangshang turn cursor"></span>
		</footer>

		<!-- 模态框 -->
		<section class="model"></section>
		<!-- js -->
		<!-- 引入swiper的JS -->
		<script src="../lib/swiper-bundle.min.js"></script>
		<!-- 引入公共js -->
		<script src="../js/util.js"></script>
		<script src="../js/footer.js"></script>
		<script src="../js/login&register.js"></script>
		<!-- 引入当前页JS -->
		<script src="../js/index.js"></script>
	</body>
</html>
